<template>
    <footer class="footer">
        <span class="todo-count"> 有<strong>{{ undo }}</strong>项未完成 </span>
        <ul class="filters">
            <li v-for="f in filterList"><a href="#/all" class="selected"
                    @click="$emit('update:filter', f.value)">{{ f.label }}</a></li>
        </ul>
        <button class="clear-completed" style="">清除已完成</button>
    </footer>
</template>

<script>
export default {
    props: ["undo", "filter"],
    data() {
        return {
            filterList: [
                { label: '全部', value: '' },
                { label: '未完成', value: false },
                { label: '已完成', value: true },

            ]
        }
    }
}
</script>